<template>
	<view>
		<!-- <popup2></popup2> -->
		
		<div class="dl_top" >

			<text class="text">你好，欢迎来到</text>
			<image mode="widthFix" class="uni-img-tag logo"  src="https://iyouhaolife-1316622368.cos.ap-chongqing.myqcloud.com/h5/static/imgs/%20logo.png"></image>

		</div>
		<div class="dlnr">
			<ul>
				<li>
					<input v-model="formData.mobile" type="number" class="wby4" maxlength="11" placeholder="请输入手机号码" />
				</li>
				<li>
					<input v-model="formData.password" type="password" class="wby5" placeholder="请输入登录密码" />
				</li>
			</ul>
			<button type="button" @click="submit" :class="{disabled:submitDisabled}" class="btn4">登录 </button>
			<p class="yhzc">
				<navigator url="/pages/login/forget_password" class="fr">
					<image mode="widthFix" class="uni-img-tag" src="https://iyouhaolife-1316622368.cos.ap-chongqing.myqcloud.com/h5/static/imgs/a51.png"></image>忘记密码
				</navigator>
				<navigator url="/pages/login/register">
					<image mode="widthFix" class="uni-img-tag" src="https://iyouhaolife-1316622368.cos.ap-chongqing.myqcloud.com/h5/static/imgs/a52.png"></image>注册新用户
				</navigator>
			</p>
		</div>
	</view>
</template>

<script>
	import http from "@/common/http.js"
	import cache from "@/common/cache.js"
	const MOBILE_REG = /^(13[0-9]|14[01456879]|15[0-35-9]|16[2567]|17[0-8]|18[0-9]|19[0-35-9])\d{8}$/;

	export default {
		data() {
			return {
				formData: {
					mobile: '',
					password: '',
				}
			}
		},
		computed: {
			mobileSuccess() {
				return MOBILE_REG.test(this.formData.mobile)
			},
			submitDisabled() {
				return !this.mobileSuccess || !this.formData.password
			}
		},
		onLoad() {

		},
		methods: {
			submit() {
				http.request({
					url: '/api/v1/login',
					method: 'POST',
					params: this.formData,
					success: ret => {
						console.log(ret);
						cache.set('user_id', ret.disUserId, 86400 * 365);
						uni.reLaunch({
							url: '/pages/index/my'
						})
					},
					fail: ret => {
						uni.showModal({
							showCancel:false,
							title:ret.errorMessage
						})
						console.log(ret);
					}
				})
			}
		}
	}
</script>

<style>
	page {
		background-color: #ffffff;
	}
	
	.logo {
		width: 60rpx;
		height: 60rpx;
	}
</style>
